const btns = document.querySelectorAll(".btns li");
const imgs = document.querySelectorAll(".imgs li");
const banner = document.querySelector(".banner");
let nowImg = imgs[0];
let nowBtn = btns[0];
let z = 2;
btns.forEach((btn, i) => {
    btn.onclick = () => {
        now = i;
        nowImg.classList.remove("active");
        imgs[i].classList.add("active");
        nowImg = imgs[i];
        nowImg.style.zIndex = z++;

        nowBtn.classList.remove("activeBtn");
        btn.classList.add("activeBtn");
        nowBtn = btn;
    }
});
let now = 0;
const swap = () => {
    now++;
    now %= 3;
    nowImg.classList.remove("active");
    imgs[now].classList.add("active");
    nowImg = imgs[now];
    nowImg.style.zIndex = z++;

    nowBtn.classList.remove("activeBtn");
    btns[now].classList.add("activeBtn");
    nowBtn = btns[now];
}
let t = setInterval(swap, 2000);
banner.onmouseenter = () => {
    clearInterval(t);
}
banner.onmouseleave = () => {
    t = setInterval(swap, 2000);
}
let exhibitImgs = document.querySelectorAll('.exhibit .img  li');
console.log(exhibitImgs);
let nowExhibit = exhibitImgs[0];
exhibitImgs.forEach((v) => {
    v.onmouseenter = () => {
        nowExhibit.classList.remove("activeImg");
        v.classList.add("activeImg");
        nowExhibit = v;
    }
    v.onmouseleave = () => {
        nowExhibit.classList.remove("activeImg");
        exhibitImgs[0].classList.add("activeImg");
        nowExhibit = exhibitImgs[0];
    }
})
let swiper = new Swiper(".mySwiper", {
    slidesPerView: "auto",
    // centeredSlides: true,
    spaceBetween: 30,
    // slidesPerView:"auto",
    // spaceBetween: 30,
});
